<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<script type="text/javascript">
	var doShopping = function(){
	    	var productCode = $('#product-code-id').val();
	    	var productQuantity = $('#product-quantity-id').val();
	    	if(productCode != "" && productQuantity != 0){
	    		$.post("/booking.html", { code: productCode, quantity: productQuantity, page: "detailproduct" }, 
		    		function(data) {
					var content = $('<div />').html(data).find('#user-login-form-id').html(); 
		 			   if(content != null){
		 				  $('#center-column').empty().append(content);
		 			   } 
		 			   else{
		 				  var page = $('<div />').html(data).find('#right-order-block-id').html(); 
		 				  
		 				  $('#right-order-block-id').empty().append(page);
		 			   }
	    		});
	    	}
	    	

	}	
</script>

<div id="content-block">

		<div class="breadcrumb">
			<a href="home.html">Trang chủ</a> »
			<c:if test = "${subNamecat == 'Rau, củ, quả'} && ${subNamecat == 'Hải sản'}">
					<a href="#">${subNamecat}</a> 	»				
			</c:if>
			<c:if test = "${subNamecat == 'Hải sản'}">
					<a href="#">${subNamecat}</a> 	»				
			</c:if>  
			
			<a href="listproduct.html?id=${catid}">${nameCat}</a>  »
			<a href="detailproduct.html?id=${product.id}">${product.name}</a>
		</div>
	<div id="page-title">${product.name}</div>
	<c:if test="${not empty isAdmin}">
           			<a href ="editproduct.html?id=${product.id}&key=${product.key}">edit info</a>
           			<a href ="editproductimage.html?id=${product.id}&key=${product.key}">edit image</a>
           			<a href = "makeproductspecial.do?id=${product.id}">move to special product</a>
           			<c:if test = "${product.isSpecial == 1}">
						<a href = "makeproductspecial.do?id=${product.id}">move to non-special product</a>
					</c:if>
     </c:if>
	<div id="node-122" class="node clear-block">


		<div class="content">
			<div
				class="view view-uc-products-detail view-id-uc_products_detail view-display-id-block_1 view-dom-id-1">



				<div class="view-content">
					<div
						class="views-row views-row-1 views-row-odd views-row-first views-row-last">
						<div class="views-field-field-image-cache-fid">
							<div class="field-content">
								<a href="#" class="nivoZoom" title="Bấm vào ảnh để phóng to" style="position: relative; display: inline-block;"> 
									<img src="/display.html?imageKey=${product.imageKey}" alt="" width="150" height="113" style="opacity: 1;">
									<img src="/display.html?imageKey=${product.imageKey}" class="nivoLarge" title="Bấm vào ảnh để thu nhỏ" style=" position: static; z-index: 99; margin:auto; display: none;">
								</a>
							</div>
						</div>

						<div class="views-field-sell-price">
							<label class="views-label-sell-price"> Giá: </label> <span
								class="field-content"><span
								style="text-decoration: line-through; color: black">
								<c:if test = "${product.price == 0}">
									<span class="uc-price"></span>
								</c:if>
								<c:if test = "${product.price > 0}">
									<span id="product-price-id" name="uc_price_name" class="uc-price">${product.price}</span>/${product.unit}<br/>
								</c:if>
								</span>
								<span class="uc-price-product uc-price-sell_price uc-price"><span name="uc_price_name"
									class="uc-price">${product.newPrice}</span>/${product.unit}</span>
								</span>
						</div>
						<div class="views-field-field-packaging-standard-value">
							<label class="views-label-field-packaging-standard-value">
								Đơn vị: </label> <span class="field-content">${product.unit}</span>
						</div>
						<c:choose>
							<c:when test="${product.quantity > 0}">
								<div class="views-field-addtocartlink">
									<label class="views-label-field-packaging-standard-value"> Số lượng: </label>
									<input id="product-quantity-id" type="number" maxlength="3" name="qty" id="edit-qty-1" size="3" value="1" class="form-text" min="1" max="${product.quantity}">
									<div class="field-content" style="padding-left:150px;">	 
										<input id="shopping-image-id" type="image" src="/images/sp_cart.jpg" name="submit" class="states" onclick="doShopping()">
 									</div> 
									</br>
								</div>
							</c:when> 
										   
							<c:otherwise>
								<div class=field-content>
									<img src="./images/sold_out.png" width=100 height=50>
								</div>
							</c:otherwise>    
						</c:choose>
						<div class="views-field-body">
							<label class="views-label-body"> THÔNG TIN SẢN PHẨM: </label>
							<div class="field-content">
								<p>${product.description.value}</p>
							</div>
						</div>
						
					</div>
				</div>
			</div>
			
		</div>
		</div>
		</div>
		<input id="product-code-id" type="hidden" value=${product.id}></input>
		<script type="text/javascript" src="./js/jquery.min.js"></script>
		<script type="text/javascript" src="./js/cufon-yui.js"></script>
		<script type="text/javascript" src="./js/jquery.nivo.zoom.pack.js"></script>
		<script type="text/javascript">
		$(window).load(function() {
			$('body').nivoZoom();
		});
		
		$(document).ready(function() {
			$('#demo a').click(function(){
				return false;
			});
			
			$('#download-form input:radio').change(function(){
				var url = $('#download-form input:radio:checked').val();
				$('#download-btn').attr('href', url);
			});
			
			$('a#download-jump').click(function(){
				$(window).scrollTo($('a[name="download"]'), 1000);
			});
			
		});
		</script>
		